<template>
  <div>
    <el-table :data="tableData" stripe height="100%">
      <el-table-column width="100" property="groupcode" label="批次号" />
      <el-table-column width="100" property="height" label="厚度" />
      <el-table-column width="100" property="metal" label="材质" />
      <el-table-column width="100" property="recommand_width" label="首选宽" />
      <el-table-column width="130" property="recommand_use_coil" label="首选卷号" />
      <el-table-column width="100" property="recommand_coil_length" label="首选耗料" />
      <el-table-column
        width="100"
        property="recommand_usage"
        label="首选利用率"
        :formatter="
          (row, column, cellValue, index) => {
            return (cellValue * 100).toFixed() + '%'
          }
        "
      />
      <el-table-column width="100" property="second_choice_width" label="次选宽" />
      <el-table-column width="130" property="second_choice_use_coil" label="次选卷号" />
      <el-table-column width="100" property="second_choice_coil_length" label="次选耗料" />
      <el-table-column
        width="100"
        property="second_choice_usage"
        label="次选利用率"
        :formatter="
          (row, column, cellValue, index) => {
            return (cellValue * 100).toFixed() + '%'
          }
        "
      />
      <el-table-column label="操作">
        <template #default="scope">
          <el-button size="small" :id="scope.row" type="primary">首选领料</el-button>
          <el-button size="small"> 次选领料 </el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script lang="ts" setup>
import { onMounted, ref } from 'vue'
import type { cut_process } from '@/types/billdata'
import { groupCutPropose } from '@/utils/groupUtils'
import { distinct } from '@/utils/common'
import { useDbStore } from '@/stores/modules/database'
const tableData = ref<t_simple_propose[]>()
type t_simple_propose = {
  groupcode: string
  height: number
  metal: string
  recommand_width: number
  recommand_use_coil?: string
  recommand_coil_length: number
  recommand_usage?: number
  second_choice_width?: number
  second_choice_use_coil?: string
  second_choice_coil_length?: number
  second_choice_usage?: number
}
onMounted(() => {
  const cut_process: cut_process[] = useDbStore().cut_process
  const all_propose = groupCutPropose(cut_process)
  const tmp: t_simple_propose[] = []
  const groups = distinct(all_propose.map((r) => r.groupcode))!
  groups.forEach((r) => {
    const group_propose = all_propose
      .filter((p) => p.groupcode === r)
      .sort((a, b) => {
        return b.usage! - a.usage!
      })
    const recommand = group_propose[0]
    const simple_propose: t_simple_propose = {
      groupcode: r,
      height: recommand.height,
      metal: typeof recommand.metal === 'string' ? recommand.metal : recommand.metal.code,
      recommand_width: recommand.width,
      recommand_use_coil: recommand.use_coil,
      recommand_usage: recommand.usage,
      recommand_coil_length: recommand.total_coil_length
    }
    if (group_propose.length > 1) {
      simple_propose.second_choice_width = group_propose[1].width
      simple_propose.second_choice_use_coil = group_propose[1].use_coil
      simple_propose.second_choice_usage = group_propose[1].usage
      simple_propose.second_choice_coil_length = group_propose[1].total_coil_length
    }
    tmp.push(simple_propose)
  })
  tableData.value = tmp
})
</script>
